<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Title</title>
	<script src="jquery.min.js"></script>
	<style>
		table{
			width: 500px;
			height: 180px;
			border-collapse: collapse;
			background-color: green;
		}
		td{
			border: 1px solid black;
		}
		.l{
			background-color: white;
		}
	</style>
</head>
<body>
<table>
	<tr>
		<td>编号</td>
		<td> 姓名</td>
		<td>性别</td>
	</tr>
	<tr>
		<td>1</td>
		<td> 马云</td>
		<td>男</td>
	</tr>
	<tr>
		<td>2</td>
		<td> 马华腾</td>
		<td>男</td>
	</tr>
	<tr>
		<td>3</td>
		<td> 刘强东</td>
		<td>男</td>
	</tr>
</table>

<script>
	$('tr').mouseover(function () {
		$(this).addClass('l');
	});
	$('tr').mouseleave(function () {
		$(this).removeClass('l');
	});

</script>
</body>
</html>